<template>
  <el-menu
    :collapse="false"
    router
    :default-active="activeMenu"
    class="el-menu-vertical"
    background-color="#001529"
    text-color="#fff"
    active-text-color="#409EFF"
  >
    <SubMenu
      v-for="item in menuConfig"
      :key="item.index"
      :menu-item="item"
    />
  </el-menu>
</template>
<script setup lang="ts">
import { computed } from 'vue'
import { useRoute } from 'vue-router'
import { menuConfig } from './menu/config.ts'
import SubMenu from './menu/SubMenu.vue'

const route = useRoute()
const activeMenu = computed(() => {
  return route.path
})
</script>

<style scoped>
.el-menu-vertical {
  border-right: none;
}
</style>
